<template>
	<view class="mypost">
		<view class="groupauditlist_top_block">
			<view class="groupauditlist_tabs">
				<view @click="changeTabs(1)"
					:class="pagetype==1?'groupauditlist_tabs_cell tabs_on':'groupauditlist_tabs_cell'">我的帖子</view>
				<view @click="changeTabs(2)"
					:class="pagetype==2?'groupauditlist_tabs_cell tabs_on':'groupauditlist_tabs_cell'">
					<view style="position: relative;">我的评论
						<view class="point" v-if="pagetype==1&&msg_comment_number>0"></view>
					</view>

				</view>
			</view>
		</view>
		<view v-if="pagetype==1" class="mypost_cell_box">
			<view class="mypost_cell_top">
				<view class="flex-1 c-666666 f-12">帖子数：{{total}}条</view>
				<view></view>
			</view>
			<view class="mypost_cell" v-for="(item,index) in list" :key="item.card_id">
				<view @click="goBbsInfo(item.card_id)">
					<view class="ellipsis-2 f-15 f-w" style="letter-spacing: 1rpx;">{{item.title}}</view>
					<view class="mt-10">
						<image class="mypost_bbs_img" :src="item.cover?picUrl+item.cover:picUrl+item.image[0]" mode="aspectFill"></image>
					</view>
				</view>
				<view class="mt-10 f-12 display_flex">
					<view class="c-999999 flex-1">{{item.time_format}}</view>
					<view class="c-666666 display_flex">
						<!-- <view class="mr-5" @click="editBbs(item.card_id)">编辑</view>
						<view>|</view> -->
						<view class="ml-5" @click="delClubMyBbs(item.card_id,index)">删除</view>
					</view>
				</view>
			</view>
			<view class="page_bottom_loading" :style="'padding-bottom:'+pdbottom+'rpx;'">{{loadingTitle}}</view>
		</view>
		<view v-if="pagetype==2" class="mypost_cell_box">
			<view class="mypost_cell_top">
				<view class="flex-1 c-666666 f-12">评论数：{{totalc}}条</view>
				<view class="">
					<uni-data-select class="step_select" v-model="paramsc.type" :localdata="commentTypelist"
						@change="changeType" :clear="false"></uni-data-select>
				</view>
			</view>
			<view class="mypost_comment_cell" v-for="(item,index) in listc" :key="item.comment_id">
				<view @click="goBbsInfo(item.card_id,1)">
					<view class="display_flex" v-if="item.is_own==1">
						<view class="f-14">我评论</view>
						<view class="f-11 c-999999 ml-15">{{item.create_time}}</view>
					</view>
					<view class="display_flex" v-else>
						<view class="c-00A0DC f-14 ellipsis">{{item.user.username}}</view>
						<view class="f-14">评论我</view>
						<view class="f-11 c-999999 ml-15">{{item.create_time}}</view>
					</view>
					<view class="c-666666 f-12 ellipsis-2 mt-10">{{item.content}}</view>
					<view class="c-999999 f-11 ellipsis mt-10"
						style="border-left: 5rpx solid #F0F0F0;padding-left: 10rpx;" v-if="item.reply_info">
						{{item.reply_info.content}}
					</view>
				</view>
				<view class="c-999999 f-11 text-r mt-10" @click="delClubMyComment(item.comment_id,index)">删除</view>
			</view>
			<view class="page_bottom_loading" :style="'padding-bottom:'+pdbottom+'rpx;'">{{loadingTitlec}}</view>
		</view>
	</view>
</template>

<script>
	import {
		getClubMyBbsList,
		delClubMyBbs,
		getClubMyCommentList,
		delClubMyComment,
		readMsgCommentDot,
		getGroupUserInfo
	} from '@/api/motortime.js';
	let app = getApp()
	export default {
		data() {
			return {
				pagetype: 1,
				params: {
					page: 1,
					size: 10
				},
				list: [],
				current_page: '',
				last_page: '',
				total: 0,
				loadingTitle: '',
				paramsc: {
					page: 1,
					size: 10,
					type: 0
				},
				listc: [],
				current_pagec: '',
				last_pagec: '',
				totalc: 0,
				loadingTitlec: '',
				msg_comment_number: 0,
				commentTypelist: [{
						value: 0,
						text: "全部评论"
					}, {
						value: 1,
						text: "我的评论"
					},
					{
						value: 2,
						text: "评论我的"
					}
				],
				picUrl: app.globalData.picUrl,
				onlinePic: app.globalData.onlinePic,
				pdbottom: uni.getSystemInfoSync().safeAreaInsets.bottom ? uni.getSystemInfoSync().safeAreaInsets.bottom +
					130 : 130,
			};
		},
		onShow() {
			if (!uni.getStorageSync('access_token')) {
				uni.navigateTo({
					url: '/pages/login/login'
				})
			}
			if (uni.getStorageSync('onload')) {
				if (this.pagetype == 1) {
					this.getClubMyBbsList()
				} else if (this.pagetype == 2) {
					this.getClubMyCommentList()
				}
				uni.removeStorage({
					key: 'onload'
				})
			}
			this.msg_comment_number = uni.getStorageSync('userinfo') ? uni.getStorageSync('userinfo').msg_comment_number :
				0
		},
		onLoad(options) {

			this.pagetype = options.pagetype ? options.pagetype : 1
			if (this.pagetype == 1) {
				this.getClubMyBbsList()
			} else if (this.pagetype == 2) {
				this.getClubMyCommentList()
			}
			var params = {
				event_code: '我的发布',
				path: 'pages/my/mypost',
				event_id: '',
				title: '',
				source_page: '',
				value: '',
			}
			app.BurialPoint(params)
		},
		methods: {
			changeTabs(type) {
				if (type == 1) {
					if (this.list.length == 0) {
						this.getClubMyBbsList()
					}
					this.pagetype = type
				} else if (type == 2) {
					if (this.listc.length == 0) {
						this.getClubMyCommentList()
					}
					this.pagetype = type
					if (this.msg_comment_number > 0) {
						readMsgCommentDot({}).then(res => {
							if (res.state == 1) {
								console.log("readMsgCommentDot↓↓↓↓")
								console.log(res)
								this.getGroupUserInfo()
							} else {
								uni.showToast({
									title: res.error[0],
									mask: true,
									icon: 'none',
									duration: 1500
								})
							}
						})
					}
				}
			},
			getGroupUserInfo() {
				getGroupUserInfo({
					user_id: uni.getStorageSync('userinfo') ? uni.getStorageSync('userinfo').user_id : ''
				}).then(res => {
					if (res.state == 1) {
						this.msg_comment_number = res.data.list.msg_comment_number
						uni.setStorage({
							key: 'userinfo',
							data: res.data.list,
							success: function() {}
						});
					} else {
						uni.removeStorage({
							key: 'access_token'
						})
					}
				})
			},
			getClubMyBbsList() {
				getClubMyBbsList(this.params).then(res => {
					if (res.state == 1) {
						this.list = [...this.list, ...res.data.data]
						this.current_page = res.data.current_page
						this.last_page = res.data.last_page
						this.total = res.data.total
						if (this.list.length == 0) {
							this.loadingTitle = "- 暂无更多 -"
						}
					} else {
						uni.showToast({
							title: res.error[0],
							mask: true,
							icon: 'none',
							duration: 1500
						})
					}
				})
			},
			goBbsInfo(card_id, type) {
				var params = {
					event_code: '我的发布',
					path: 'pages/my/mypost',
					event_id: card_id,
					title: '',
					source_page: '点击跳转',
					value: '',
				}
				app.BurialPoint(params)
				uni.navigateTo({
					url: '/pages/bbs/bbsinfo?card_id=' + card_id + '&isComment=' + type
				})
			},
			changeType(e) {
				this.loadingTitlec = ''
				this.paramsc.page = 1
				this.listc = []
				this.getClubMyCommentList()
			},
			delClubMyBbs(card_id, index) {
				var that = this
				
				uni.showModal({
					content: '确认删除吗',
					confirmText: '确认',
					confirmColor: '#00A0DC',
					success: function(res) {
						if (res.confirm) {
							var params = {
								event_code: '我的发布',
								path: 'pages/my/mypost',
								event_id: card_id,
								title: '',
								source_page: '我的发布-删除帖子',
								value: '',
							}
							app.BurialPoint(params)
							delClubMyBbs({
								card_id: card_id
							}).then(res => {
								if (res.state == 1) {
									that.list.splice(index, 1)
								} else {
									uni.showToast({
										title: res.error[0],
										mask: true,
										icon: 'none',
										duration: 1500
									})
								}
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});

			},

			delClubMyComment(comment_id, index) {
				var that = this
				uni.showModal({
					content: '确认删除吗',
					confirmText: '确认',
					confirmColor: '#00A0DC',
					success: function(res) {
						if (res.confirm) {
							var params = {
								event_code: '我的发布',
								path: 'pages/my/mypost',
								event_id: comment_id,
								title: '',
								source_page: '我的发布-删除评论',
								value: '',
							}
							app.BurialPoint(params)
							delClubMyComment({
								comment_id: comment_id
							}).then(res => {
								if (res.state == 1) {
									that.listc.splice(index, 1)
								} else {
									uni.showToast({
										title: res.error[0],
										mask: true,
										icon: 'none',
										duration: 1500
									})
								}
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			getClubMyCommentList() {
				getClubMyCommentList(this.paramsc).then(res => {
					if (res.state == 1) {
						this.listc = [...this.listc, ...res.data.data]
						this.current_pagec = res.data.current_page
						this.last_pagec = res.data.last_page
						this.totalc = res.data.total
						if (this.listc.length == 0) {
							this.loadingTitlec = "- 暂无更多 -"
						}
					} else {
						uni.showToast({
							title: res.error[0],
							mask: true,
							icon: 'none',
							duration: 1500
						})
					}
				})
			}
		},
		onPullDownRefresh() {
			if (this.pagetype == 1) {
				this.params.page = 1
				this.list = []
				this.getClubMyBbsList()
			} else if (this.pagetype == 2) {
				this.paramsc.page = 1
				this.listc = []
				this.getClubMyCommentList()
			}
			uni.stopPullDownRefresh()
		},
		onReachBottom() {
			if (this.pagetype == 1) {
				if (this.current_page < this.last_page) {
					this.showLoading = true
					this.params.page = this.params.page + 1
					this.getClubMyBbsList()
				} else {
					this.showLoading = false
					if (this.list.length > 0) {
						this.loadingTitle = "- 已经到底了 -"
					} else {
						this.loadingTitle = "- 暂无更多 -"
					}
				}
			} else if (this.pagetype == 2) {
				if (this.current_pagec < this.last_pagec) {
					this.paramsc.page = this.paramsc.page + 1
					this.getClubMyCommentList()
				} else {
					if (this.listc.length > 0) {
						this.loadingTitlec = "- 已经到底了 -"
					} else {
						this.loadingTitlec = "- 暂无更多 -"
					}
				}
			}

		},
	}
</script>

<style lang="scss">
	.mypost {
		padding: 30rpx;

		.groupauditlist_top_block {
			padding: 0 0 30rpx 0;
			position: sticky;
			top: 0;
			z-index: 1;
			background-color: #ffffff;

			.groupauditlist_tabs {
				height: 80rpx;
				font-size: 30rpx;
				display: flex;
				align-items: center;
				justify-content: space-around;
				border-radius: 8rpx;
				border: 2rpx solid #E9E9E9;

				.groupauditlist_tabs_cell {
					position: relative;
					width: 50%;
					height: 30rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					border-right: 3rpx solid #000000;
				}

				.groupauditlist_tabs_cell:last-child {
					border-right: 0;
				}

				.tabs_on {
					color: #00A0DC;
				}

				.point {
					width: 12rpx;
					height: 12rpx;
					border-radius: 100%;
					position: absolute;
					top: 4rpx;
					right: -4rpx;
					background-color: #F84949;
					color: #fff;
					text-align: center;
				}
			}
		}

		.mypost_cell_box {

			.mypost_cell_top {
				display: flex;
				align-items: center;
				margin-top: 30rpx;

				.step_select {
					.uni-select {
						color: #666666 !important;
						height: 50rpx !important;
						background-color: #F1F1F1 !important;
						border: none !important;
					}
				}
			}

			.mypost_cell {
				padding: 30rpx 0;
				border-bottom: 1rpx solid #E9E9E9;

				.mypost_bbs_img {
					width: 100%;
					vertical-align: middle;
				}
			}

			.mypost_comment_cell {
				padding: 30rpx;
				margin-top: 30rpx;
				border-radius: 8rpx;
				border: 1rpx solid #E9E9E9;
			}
		}

	}
</style>